import * as Cesium from "cesium";
import GlobePolylineDrawer from "./GlobePolylineDrawer";
import GlobePolygonDrawer from "./GlobePolygonDrawer";
import GlobeCircleDrawer from "./GlobeCircleDrawer";
import GlobeRectangleDrawer from "./GlobeRectangleDrawer";
import GlobePointDrawer from "./GlobePointDrawer";
import { v4 as uuidv4 } from "uuid";

class Draw {
    constructor(viewer) {
        this.viewer = viewer;
        this.shapeDic = {};
        this.layerId = "globeDrawerDemoLayer";
        this.polylineDrawer = null;
        this.polygonDrawer = null;
        this.circleDrawer = null;
        this.rectangleDrawer = null;
        this.pointDrawer = null;
        this.ctrArr = [];
        this.flag = 0;
        this.bindGloveEvent();
    }

    //绑定事件
    bindGloveEvent() {
        const { flag, viewer } = this;
        var handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);
        handler.setInputAction((movement) => {
            var pick = viewer.scene.pick(movement.position);
            if (!pick) {
                return;
            }
            var obj = pick.id;
            if (!obj || !obj.layerId || this.flag == 0) {
                return;
            }
            var objId = obj.objId;
            //flag为编辑或删除标识,1为编辑，2为删除
            if (this.flag === 1) {
                switch (obj.shapeType) {
                    case "Polygon":
                        this.flag = 0;
                        this.editPolygon(objId);
                        break;
                    case "Polyline":
                        this.flag = 0;
                        this.editPolyline(objId);
                        break;
                    case "Rectangle":
                        this.flag = 0;
                        this.editRectangle(objId);
                        break;
                    case "Circle":
                        this.flag = 0;
                        this.editCircle(objId);
                        break;
                    case "Point":
                        this.flag = 0;
                        this.editPoint(objId);
                        break;
                    // case "BufferLine":
                    //     flag = 0;
                    //     this.editBufferLine(objId);
                    //     break;
                    // case "StraightArrow":
                    //     flag = 0;
                    //     this.editStraightArrow(objId);
                    //     break;
                    // case "AttackArrow":
                    //     flag = 0;
                    //     this.editAttackArrow(objId);
                    //     break;
                    // case "PincerArrow":
                    //     flag = 0;
                    //     this.editPincerArrow(objId);
                    //     break;
                    default:
                        break;
                }
            } else if (this.flag === 2) {
                console.log(11);
                clearEntityById(objId);
            }
        }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
    }

    //编辑多边形
    editPolygon(objId) {
        var oldPositions = this.shapeDic[objId];
        //先移除entity
        this.clearEntityById(objId);
        //进入编辑状态
        this.polygonDrawer.showModifyPolygon(
            oldPositions,
            (positions) => {
                this.shapeDic[objId] = positions;
                this.showPolygon(objId, positions);
            },
            () => {
                this.showPolygon(objId, oldPositions);
            }
        );
    }

    //编辑折线
    editPolyline(objId) {
        var oldPositions = this.shapeDic[objId];
        //先移除entity
        this.clearEntityById(objId);
        //进入编辑状态
        this.polylineDrawer.showModifyPolyline(
            oldPositions,
            (positions) => {
                this.shapeDic[objId] = positions;
                this.showPolyline(objId, positions);
            },
            () => {
                this.showPolyline(objId, oldPositions);
            }
        );
    }

    //编辑正方形
    editRectangle(objId) {
        var oldPositions = this.shapeDic[objId];
        //先移除entity
        this.clearEntityById(objId);
        //进入编辑状态
        this.rectangleDrawer.showModifyRectangle(
            oldPositions,
            (positions) => {
                this.shapeDic[objId] = positions;
                this.showRectangle(objId, positions);
            },
            () => {
                this.showRectangle(objId, oldPositions);
            }
        );
    }

    //编辑圆
    editCircle(objId) {
        var oldPositions = this.shapeDic[objId];
        //先移除entity
        this.clearEntityById(objId);
        //进入编辑状态
        this.circleDrawer.showModifyCircle(
            oldPositions,
            (positions) => {
                this.shapeDic[objId] = positions;
                this.showCircle(objId, positions);
            },
            () => {
                this.showCircle(objId, oldPositions);
            }
        );
    }

    //编辑点
    editPoint(objId) {
        var oldPosition = this.shapeDic[objId];
        this.clearEntityById(objId);
        //进入编辑状态
        this.pointDrawer.showModifyPoint(
            oldPosition,
            (position) => {
                this.shapeDic[objId] = position;
                this.showPoint(objId, position);
            },
            () => {
                this.showPoint(objId, oldPosition);
            }
        );
    }

    //绘制点
    GlobePointDrawer() {
        this.pointDrawer = new GlobePointDrawer(this.viewer);
        this.pointDrawer.startDrawPoint((positions) => {
            var objId = uuidv4();
            this.shapeDic[objId] = positions;
            this.showPoint(objId, positions);
        });
        this.ctrArr.push(this.pointDrawer);
    }

    //绘制折线
    GlobePolylineDrawer() {
        this.polylineDrawer = new GlobePolylineDrawer(this.viewer);
        this.polylineDrawer.startDrawPolyline((positions) => {
            var objId = uuidv4();
            this.shapeDic[objId] = positions;
            this.showPolyline(objId, positions);
        });
        this.ctrArr.push(this.polylineDrawer);
    }

    //绘制多边形
    GlobePolygonDrawer() {
        this.polygonDrawer = new GlobePolygonDrawer(this.viewer);
        this.polygonDrawer.startDrawPolygon((positions) => {
            var objId = uuidv4();
            this.shapeDic[objId] = positions;
            this.showPolygon(objId, positions);
        });
        this.ctrArr.push(this.polygonDrawer);
    }

    //绘制圆
    GlobeCircleDrawer() {
        this.circleDrawer = new GlobeCircleDrawer(this.viewer);
        this.circleDrawer.startDrawCircle((positions) => {
            var objId = uuidv4();
            this.shapeDic[objId] = positions;
            this.showCircle(objId, positions);
        });
        this.ctrArr.push(this.circleDrawer);
    }

    //绘制正方形
    GlobeRectangleDrawer() {
        this.rectangleDrawer = new GlobeRectangleDrawer(this.viewer);
        this.rectangleDrawer.startDrawRectangle((positions) => {
            var objId = uuidv4();
            this.shapeDic[objId] = positions;
            this.showRectangle(objId, positions);
        });
        this.ctrArr.push(this.rectangleDrawer);
    }

    //进入编辑状态
    editDrawer() {
        window.$message.info("请点击要编辑的图形", {
            duration: 1000,
        });
        var _this = this;
        for (var i = 0; i < _this.ctrArr.length; i++) {
            try {
                var ctr = _this.ctrArr[i];
                if (ctr.clear) {
                    ctr.clear();
                }
            } catch (err) {
                console.log("发生未知出错：GlobeTracker.clear");
            }
        }

        this.flag = 1;
    }

    //折线
    showPolyline(objId, positions) {
        var material = new Cesium.PolylineGlowMaterialProperty({
            glowPower: 0.25,
            color: Cesium.Color.fromCssColorString("#00f").withAlpha(0.9),
        });
        var bData = {
            layerId: this.layerId,
            objId: objId,
            shapeType: "Polyline",
            polyline: {
                positions: positions,
                clampToGround: true,
                width: 8,
                material: material,
            },
        };
        var entity = this.viewer.entities.add(bData);
    }

    //多边形
    showPolygon(objId, positions) {
        var material = Cesium.Color.fromCssColorString("#ff0").withAlpha(0.5);
        var outlineMaterial = new Cesium.PolylineDashMaterialProperty({
            dashLength: 16,
            color: Cesium.Color.fromCssColorString("#00f").withAlpha(0.7),
        });
        var outlinePositions = [].concat(positions);
        outlinePositions.push(positions[0]);
        var bData = {
            layerId: this.layerId,
            objId: objId,
            shapeType: "Polygon",
            polyline: {
                positions: outlinePositions,
                clampToGround: true,
                width: 2,
                material: outlineMaterial,
            },
            polygon: new Cesium.PolygonGraphics({
                hierarchy: positions,
                asynchronous: false,
                material: material,
            }),
        };
        var entity = this.viewer.entities.add(bData);
    }

    //圆
    showCircle(objId, positions) {
        var material = Cesium.Color.fromCssColorString("#ff0").withAlpha(0.5);
        var outlineMaterial = new Cesium.PolylineDashMaterialProperty({
            dashLength: 16,
            color: Cesium.Color.fromCssColorString("#f00").withAlpha(0.7),
        });
        var radiusMaterial = new Cesium.PolylineDashMaterialProperty({
            dashLength: 16,
            color: Cesium.Color.fromCssColorString("#00f").withAlpha(0.7),
        });
        var pnts = this.circleDrawer._computeCirclePolygon(positions);
        var dis = this.circleDrawer._computeCircleRadius3D(positions);
        dis = (dis / 1000).toFixed(3);
        var text = dis + "km";
        var bData = {
            layerId: this.layerId,
            objId: objId,
            shapeType: "Circle",
            position: positions[0],
            label: {
                text: text,
                font: "16px Helvetica",
                fillColor: Cesium.Color.SKYBLUE,
                outlineColor: Cesium.Color.BLACK,
                outlineWidth: 1,
                style: Cesium.LabelStyle.FILL_AND_OUTLINE,
                eyeOffset: new Cesium.ConstantProperty(
                    new Cesium.Cartesian3(0, 0, -9000)
                ),
                pixelOffset: new Cesium.Cartesian2(16, 16),
            },
            billboard: {
                image: "/static/images/common/circle_center.png",
                eyeOffset: new Cesium.ConstantProperty(
                    new Cesium.Cartesian3(0, 0, -500)
                ),
                heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
            },
            polyline: {
                positions: positions,
                clampToGround: true,
                width: 2,
                material: radiusMaterial,
            },
            polygon: new Cesium.PolygonGraphics({
                hierarchy: pnts,
                asynchronous: false,
                material: material,
            }),
        };
        var entity = viewer.entities.add(bData);

        var outlineBdata = {
            layerId: this.layerId,
            objId: objId,
            shapeType: "Circle",
            polyline: {
                positions: pnts,
                clampToGround: true,
                width: 2,
                material: outlineMaterial,
            },
        };
        var outlineEntity = this.viewer.entities.add(outlineBdata);
    }

    //正方形
    showRectangle(objId, positions) {
        var material = Cesium.Color.fromCssColorString("#ff0").withAlpha(0.5);
        var outlineMaterial = new Cesium.PolylineDashMaterialProperty({
            dashLength: 16,
            color: Cesium.Color.fromCssColorString("#00f").withAlpha(0.7),
        });
        var rect = Cesium.Rectangle.fromCartesianArray(positions);
        var arr = [
            rect.west,
            rect.north,
            rect.east,
            rect.north,
            rect.east,
            rect.south,
            rect.west,
            rect.south,
            rect.west,
            rect.north,
        ];
        var outlinePositions = Cesium.Cartesian3.fromRadiansArray(arr);
        var bData = {
            layerId: this.layerId,
            objId: objId,
            shapeType: "Rectangle",
            polyline: {
                positions: outlinePositions,
                clampToGround: true,
                width: 2,
                material: outlineMaterial,
            },
            rectangle: {
                coordinates: rect,
                material: material,
            },
        };
        var entity = this.viewer.entities.add(bData);
    }

    //点
    showPoint(objId, position) {
        var entity = this.viewer.entities.add({
            layerId: this.layerId,
            objId: objId,
            shapeType: "Point",
            position: position,
            billboard: {
                image: "/static/images/common/circle_red.png",
                eyeOffset: new Cesium.ConstantProperty(
                    new Cesium.Cartesian3(0, 0, -500)
                ),
                heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
            },
        });
    }

    //清除实例
    clearEntityById(objId) {
        var entityList = this.viewer.entities.values;
        if (entityList == null || entityList.length < 1) {
            return;
        }
        for (var i = 0; i < entityList.length; i++) {
            var entity = entityList[i];
            if (entity.layerId == this.layerId && entity.objId == objId) {
                this.viewer.entities.remove(entity);
                i--;
            }
        }
    }
}

export default Draw;
